<template>
  <h1>EL-单选组件</h1>
  <el-radio-group v-model="edu">
    <!-- label="": 保存当前选项显示的文本 value="": 保存当前选项的值 -->
    <el-radio label="学历:初中" value="初中"></el-radio>
    <el-radio label="学历:高中" value="高中"></el-radio>
    <!-- 因此 此种写法也可以 -->
    <el-radio label="学历:本科" value="本科"/>
    <!-- 因此 此种写法也可以 -->
    <el-radio value="硕士">学历:硕士</el-radio>
  </el-radio-group>
  <h4>您选中的学历为:{{edu}}</h4>
  <hr>
  <el-radio-group v-model="result">
    <!-- <el-radio-button v-for="p in arr">{{p.title}}</el-radio-button> -->
    <el-radio-button v-for="p in arr" :label="p.title" :value="p.price"></el-radio-button>
  </el-radio-group>
  <h4>您选中酒品的价格为:{{result}}</h4>
</template>

<script setup>
import {ref} from "vue";

const edu = ref('');

// 准备数组存储原始数据
const arr = ref([
  {title:'五粮液',price:20},
  {title:'茅台',price:99},
  {title:'汾酒',price:40},
  {title:'二锅头',price:450}
])
const result = ref('');
</script>

<style scoped>

</style>